<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<html>
<head>
  <title>玩玩而已</title>
    <link rel="stylesheet" type="text/css" href="jslib/ext-3.4.0/resources/css/ext-all.css" />
    <style type="text/css">
    html, body {
        font:normal 12px verdana;
        margin:0;
        padding:0;
        border:0 none;
        overflow:hidden;
        height:100%;
    }
    p {
        margin:5px;
    }
    .settings {
        background-image:url(jslib/ext-3.4.0/examples/shared/icons/fam/folder_wrench.png);
    }
    .nav {
        background-image:url(jslib/ext-3.4.0/examples/shared/icons/fam/folder_go.png);
    }
    </style>

    <!-- GC -->
    <!-- LIBS -->
    <script type="text/javascript" src="jslib/ext-3.4.0/adapter/ext/ext-base.js"></script>
    <!-- ENDLIBS -->

    <script type="text/javascript" src="jslib/ext-3.4.0/ext-all.js"></script>

    <!-- EXAMPLES -->
    <script type="text/javascript" src="jslib/ext-3.4.0/examples/shared/examples.js"></script>
    
    <script type="text/javascript" src="jslib/basic.js"></script>
    <script type="text/javascript" src="jslib/layout-browser.js"></script>
    <script type="text/javascript">
    Ext.onReady(function(){
		Ext.BLANK_IMAGE_URL = '../../extjs2.0/resources/images/default/s.gif';
		
		var tabPanel = new Ext.TabPanel({
			height : 800,
			width : 800,
			activeTab : 0,              //默认激活第一个tab页
			animScroll : true,           //使用动画滚动效果
			enableTabScroll : true,       //tab标签超宽时自动出现滚动按钮
			applyTo : Ext.getBody(),
			items : [
				{title: 'tab标签页1',html : '5555'}
			],
			buttons : [
				{
					text : '添加标签页',
					handler : addTabPage
				}
			]
		});
		function addTabPage(){
			var index = tabPanel.items.length + 1;
			var tabPage = tabPanel.add({          //动态添加tab页
				title: 'tab标签页'+index,
				html : 'tab标签页'+index+'内容',
				closable : true                  //允许关闭
			})
			tabPanel.setActiveTab(tabPage);       //设置当前tab页
		}
		

 		PersonInfoFormPanel = Ext.extend(Ext.form.FormPanel,{
			constructor:function(_cfg){
				if(cfg == null){
					_cfg={};
				}
				Ext.apply(this,_cfg);
				PersonInfoPanel.superclass.constructor.call(this,{
					labelWidth:45,
					defaultType:"textfield",
					defaults:{anchor:"98%"},
					baseCls:"x-plain",
					items:[
					       {
					    	   fieldLabel:"名字",
					    	   name:"name"
					       },
					       {
					    	   fieldLabel:"年龄",
					    	   vtype:"age",
					    	   name:"age"
					       },{
					    	   xtype:"combo",
					    	   hiddenName:"sex",
					    	   fieldLabel:"性别",
					    	   mode:"local",
					    	   displayField:"sex",
					    	   readOnly:true,
					    	   triggerAction:"all",
					    	   value:"男",
					    	   store:new Ext.data.SimpleStore(
					    			{
					    				field:["sex"],
					    				data:[["男"],["女"]]
					    			}	   
					    	   )
					    	   
					       }
					 ]
					
				})
			}
		}); 
		
 		PersonInfoViewFormPanel = Ext.extend(PersonInfoFormPanel,{
 			constructor:function(){
 				PersonInfoViewFormPanel.supperclass.constructor.call(this,{
 					renderTo:Ext.getBody(),
 					defaults:{readOnly:true},
 				})
 			}
 		});
 		
 		var tablePanel = new PersonInfoViewFormPanel();
		
	});

  </script>
</head>
<body>

</body>
</html>